var baseChart;
function loadCharts() {
	var reportId = $("#reportId").val().replace(",","");
	
	$.ajax({
		url:"/report/isHaveCharts/"+reportId,
		type:"get",
		contentType:"application/json",
		success:function(data){//1 y 0 n
			if (data == 1){
				$.ajax({
					url : "/report/chart/loadLineChartData/" + reportId,
					type : 'get',
					contentType : "application/json",
					success : function(data) {
						var json = eval('(' + data + ')');
						if (json.code == '000') {
							baseChart = json.detail.baseChart;

							for (var i = 0; i < baseChart.types.length; i++) {
								if (baseChart.types[i] == '101') {
									loadColumnData('bar');
									document.getElementById("container_bar").hidden = false;
								} else if (baseChart.types[i] == '102') {
									loadColumnData('line');
									document.getElementById("container_line").hidden = false;
								} else if (baseChart.types[i] == '103') {

									loadPieData();
									document.getElementById("container_pie").hidden = false;
								}
							}
						}
					}
				});
			}
		}
	})
	
}

function loadColumnData(type) {
	
	var barChartData = {
		labels : baseChart.xAxesLabels,
		datasets : baseChart.chartDatas
	};

	var ctx = $("#canvas_bar");
	if (type == 'line') {
		ctx = $("#canvas_line");
	}
	var config = {
		type : type,
		data : barChartData,
		options : {
			// Elements options apply to all of the options unless overridden in
			// a dataset
			// In this case, we are setting the border of each bar to be 2px
			// wide and green
			elements : {
				rectangle : {
					borderWidth : baseChart.borderWidth,
					borderColor : baseChart.borderColor,
					borderSkipped : baseChart.borderSkipped
				}
			},
			responsive : true,
			legend : {
				position : 'top',
			},
			title : {
				display : true,
				text : baseChart.title
			},
			scales : {
				xAxes : [ {
					display : true,
					scaleLabel : {
						display : true,
						labelString : baseChart.xAxesTitle
					}
				} ],
				yAxes : [ {
					display : true,
					scaleLabel : {
						display : true,
						labelString : baseChart.yAxesTitle
					},

				} ]
			}
		},

	};
	new Chart(ctx, config);
}

function loadPieData() {
	var config = {
		type : 'pie',
		data : {
			datasets : baseChart.pieChartDatas,
			labels : baseChart.pieChartLabels
		},
		options : {
			responsive : true,
			legend : {
				position : 'bottom',
			},
			title : {
				display : true,
				text : baseChart.titleForPie
			},
			animation : {
				animateScale : true,
				animateRotate : true
			}
		}
	};

	var ctx = document.getElementById("canvas_pie");
	var chart = new Chart(ctx, config);

}

var randomScalingFactor = function() {
	return (Math.random() > 0.5 ? 1.0 : -1.0) * Math.round(Math.random() * 100);
};
var randomColorFactor = function() {
	return Math.round(Math.random() * 255);
};
var randomColor = function() {
	return 'rgba(' + randomColorFactor() + ',' + randomColorFactor() + ','
			+ randomColorFactor() + ',.7)';
};

function toList() {
	location.href = "/report/config";
}